<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <style type="text/css">
			* { margin:0; padding:0; } /* to remove the top and left whitespace */
			html, body { width:100%; height:100%; } /* just to be sure these are full screen*/

            #canvas1{
				border: solid 1px brown;
				cursor: crosshair;
				
			}
            #colors{margin:0;padding:0;}
            #colors li{ height: 20px; width: 20px; display: block; cursor: pointer; }
            #colors li.selected{ height: 18px; width: 18px; display: block; border: solid 1px #eee; }
        </style>
        <script src="jquery.js" type="text/javascript"></script>
        <script src="canvas.js" type="text/javascript"></script>
    </head>

    <body>
		<div>
            <canvas id="canvas1" width="240" height="200"></canvas>
        </div>
        <div>
            <br style="clear:both;"/>
        <button id="undo" href="#" disabled="disabled">Undo</button>
        <button id="clear" href="#">Reset</button> 
        <button id="export" href="#">Export as Image</button> 
        </div>
    
</body>
</html>
